<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Insert title here</title>
</head>
<!-- bootstrap & fontawesome -->
<link rel="stylesheet" href="../assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="../assets/font-awesome/4.5.0/css/font-awesome.min.css" />

<!-- page specific plugin styles -->
<link rel="stylesheet" href="../assets/css/bootstrap-duallistbox.min.css" />
<link rel="stylesheet" href="../assets/css/bootstrap-multiselect.min.css" />
<link rel="stylesheet" href="../assets/css/select2.min.css" />
<!-- text fonts -->
<link rel="stylesheet" href="../assets/css/fonts.googleapis.com.css" />
<!-- ace styles -->
<link rel="stylesheet" href="../assets/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />
<link rel="stylesheet" href="../assets/css/ace-skins.min.css" />
<link rel="stylesheet" href="../assets/css/ace-rtl.min.css" />

<!-- 时间样式 -->
<link rel="stylesheet" href="../assets/css/jquery-ui.custom.min.css" />
<link rel="stylesheet" href="../assets/css/chosen.min.css" />
<link rel="stylesheet" href="../assets/css/bootstrap-datepicker3.min.css" />
<link rel="stylesheet" href="../assets/css/bootstrap-timepicker.min.css" />
<link rel="stylesheet" href="../assets/css/daterangepicker.min.css" />
<link rel="stylesheet" href="../assets/css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet" href="../assets/css/bootstrap-colorpicker.min.css" />



<!-- 修改表格的JS -->
<script type="text/javascript" src='../bootStrapTable/js/jquery-3.2.1.min.js'></script>
<script type="text/javascript" src="../bootStrapTable/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../bootStrapTable/js/bootstrap-editable.min.js"></script>

<!-- 显示表格的JS -->
<script src="../bootStrapTable/js/bootstrap-table.js"></script>
<script src="../bootStrapTable/js/bootstrap-table-zh-CN.js"></script>
<script src="../assets/js/ace-extra.min.js"></script>
<script type="text/javascript" src="../layer/layer.js"></script>
<script type="text/javascript" src='../youhui/update.js'></script>
<body style="background: white;">
	<div class="main-container ace-save-state" id="main-container">
		<div class="main-content">
			<div class="main-content-inner">
				<div class="page-content">
					<div class="page-header">
						<h1>
							管理优惠活动 <small> <i class="ace-icon fa fa-angle-double-right"></i> 修改
							</small>
						</h1>
					</div>
					<!-- /.page-header -->
					<div class="row">
						<div class="col-xs-12">
							<!-- PAGE CONTENT BEGINS -->
							<form class="form-horizontal" role="form" id='form'>

								<input type="hidden" th:field="${ar.yid}" id='yid' class="col-xs-10 col-sm-6" name='ytitle' />

								<div class="form-group">
									<label class="col-sm-4 control-label no-padding-right" for="form-field-1-1"> 优惠活动名称 </label>

									<div class="col-sm-8">
										<input type="text" th:field="${ar.ytitle}" placeholder="Text Field" id='ytitle' class="col-xs-10 col-sm-6" name='ytitle' />
									</div>
								</div>
								<div class="form-group">
									<label class="col-sm-4 control-label no-padding-right" for="form-field-1-1"> 时间范围 </label>
									<div class="col-sm-4">
										<div class="input-daterange input-group">
											<input type="text" class="input-sm form-control" name="start" placeholder="开始时间" id='ybegintime' th:field="${ar.ybegintime}" /> <span class="input-group-addon"> <i class="fa fa-exchange"></i>
											</span> <input type="text" class="input-sm form-control" placeholder="结束时间" id='yendtime' th:field="${ar.yendtime}" name="end" />
										</div>
									</div>
								</div>

								<div class="form-group">
									<label class="col-sm-4 control-label no-padding-right" for="form-field-1-1"> 优惠金额 </label>

									<div class="col-sm-8">
										<input type="text" placeholder="Text Field" th:field="${ar.ymoney}" id='ymoney' class="col-xs-10 col-sm-6" name='ytitle' />
									</div>
								</div>
								<div class="form-group">
									<label class="col-sm-4 control-label no-padding-right" for="form-field-1-1"> 起始金额 </label>

									<div class="col-sm-8">
										<input type="text" placeholder="Text Field" th:field="${ar.ylessmoney}" id='ylessmoney' class="col-xs-10 col-sm-6" name='ytitle' />
									</div>
								</div>

								<div class="clearfix form-actions">
									<div class="col-md-offset-4 col-md-8 col-sm-6  col-sm-6">
										<button class="btn btn-info" type="button" id='update'>
											<i class="ace-icon fa fa-check bigger-110"></i> 修改
										</button>

										&nbsp; &nbsp; &nbsp;
										<button class="btn" type="reset" id='cancel'>
											<i class="ace-icon fa fa-undo bigger-110"></i> 取消
										</button>
									</div>
								</div>

							</form>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script src="../assets/js/jquery-2.1.4.min.js"></script>

	<!-- 显示表格的JS -->
	<script src="../assets/js/jquery-ui.custom.min.js"></script>
	<script src="../assets/js/jquery.ui.touch-punch.min.js"></script>
	<script src="../assets/js/chosen.jquery.min.js"></script>
	<script src="../assets/js/spinbox.min.js"></script>
	<script src="../assets/js/bootstrap-datepicker.min.js"></script>
	<script src="../assets/js/bootstrap-timepicker.min.js"></script>
	<script src="../assets/js/moment.min.js"></script>
	<script src="../assets/js/daterangepicker.min.js"></script>
	<script src="../assets/js/bootstrap-datetimepicker.min.js"></script>
	<script src="../assets/js/bootstrap-colorpicker.min.js"></script>
	<script src="../assets/js/jquery.knob.min.js"></script>
	<script src="../assets/js/autosize.min.js"></script>
	<script src="../assets/js/jquery.inputlimiter.min.js"></script>
	<script src="../assets/js/jquery.maskedinput.min.js"></script>
	<script src="../assets/js/bootstrap-tag.min.js"></script>

	<!-- ace scripts -->
	<script src="../assets/js/ace-elements.min.js"></script>
	<script src="../assets/js/ace.min.js"></script>

	<script type="text/javascript">
		jQuery(function($) {
			//datepicker plugin
			//link
			$('.date-picker').datepicker({
				autoclose : true,
				todayHighlight : true
			})
			//show datepicker when clicking on the icon
			.next().on(ace.click_event, function() {
				$(this).prev().focus();
			});

			//or change it into a date range picker
			$('.input-daterange').datepicker({
				autoclose : true,
				format : 'yyyy-mm-dd'
			});

			//to translate the daterange picker, please copy the "examples/daterange-fr.js" contents here before initialization
			$('input[name=date-range-picker]').daterangepicker({
				'applyClass' : 'btn-sm btn-success',
				'cancelClass' : 'btn-sm btn-default',
				locale : {
					applyLabel : 'Apply',
					cancelLabel : 'Cancel',
				}
			}).prev().on(ace.click_event, function() {
				$(this).next().focus();
			});

			$('#timepicker1').timepicker({
				minuteStep : 1,
				showSeconds : true,
				showMeridian : false,
				disableFocus : true,
				icons : {
					up : 'fa fa-chevron-up',
					down : 'fa fa-chevron-down'
				}
			}).on('focus', function() {
				$('#timepicker1').timepicker('showWidget');
			}).next().on(ace.click_event, function() {
				$(this).prev().focus();
			});

			if (!ace.vars['old_ie'])
				$('#date-timepicker1').datetimepicker({
					//format: 'MM/DD/YYYY h:mm:ss A',//use this option to display seconds
					icons : {
						time : 'fa fa-clock-o',
						date : 'fa fa-calendar',
						up : 'fa fa-chevron-up',
						down : 'fa fa-chevron-down',
						previous : 'fa fa-chevron-left',
						next : 'fa fa-chevron-right',
						today : 'fa fa-arrows ',
						clear : 'fa fa-trash',
						close : 'fa fa-times'
					}
				}).next().on(ace.click_event, function() {
					$(this).prev().focus();
				});

			$('#colorpicker1').colorpicker();
			//$('.colorpicker').last().css('z-index', 2000);//if colorpicker is inside a modal, its z-index should be higher than modal'safe

			$('#simple-colorpicker-1').ace_colorpicker();
			//$('#simple-colorpicker-1').ace_colorpicker('pick', 2);//select 2nd color
			//$('#simple-colorpicker-1').ace_colorpicker('pick', '#fbe983');//select #fbe983 color
			//var picker = $('#simple-colorpicker-1').data('ace_colorpicker')
			//picker.pick('red', true);//insert the color if it doesn't exist

			$(".knob").knob();

			var tag_input = $('#form-field-tags');
			try {
				tag_input.tag({
					placeholder : tag_input.attr('placeholder'),
					//enable typeahead by specifying the source array
					source : ace.vars['US_STATES'], //defined in ace.js >> ace.enable_search_ahead
				/**
				//or fetch data from database, fetch those that match "query"
				source: function(query, process) {
				  $.ajax({url: 'remote_source.php?q='+encodeURIComponent(query)})
				  .done(function(result_items){
					process(result_items);
				  });
				}
				 */
				})

				//programmatically add/remove a tag
				var $tag_obj = $('#form-field-tags').data('tag');
				$tag_obj.add('Programmatically Added');

				var index = $tag_obj.inValues('some tag');
				$tag_obj.remove(index);
			} catch (e) {
				//display a textarea for old IE, because it doesn't support this plugin or another one I tried!
				tag_input.after('<textarea id="' + tag_input.attr('id') + '" name="' + tag_input.attr('name') + '" rows="3">' + tag_input.val() + '</textarea>').remove();
				//autosize($('#form-field-tags'));
			}

			/////////
			$('#modal-form input[type=file]').ace_file_input({
				style : 'well',
				btn_choose : 'Drop files here or click to choose',
				btn_change : null,
				no_icon : 'ace-icon fa fa-cloud-upload',
				droppable : true,
				thumbnail : 'large'
			})

			//chosen plugin inside a modal will have a zero width because the select element is originally hidden
			//and its width cannot be determined.
			//so we set the width after modal is show
			$('#modal-form').on('shown.bs.modal', function() {
				if (!ace.vars['touch']) {
					$(this).find('.chosen-container').each(function() {
						$(this).find('a:first-child').css('width', '210px');
						$(this).find('.chosen-drop').css('width', '210px');
						$(this).find('.chosen-search input').css('width', '200px');
					});
				}
			})
			/**
			//or you can activate the chosen plugin after modal is shown
			//this way select element becomes visible with dimensions and chosen works as expected
			$('#modal-form').on('shown', function () {
				$(this).find('.modal-chosen').chosen();
			})
			 */

			$(document).one('ajaxloadstart.page', function(e) {
				autosize.destroy('textarea[class*=autosize]')

				$('.limiterBox,.autosizejs').remove();
				$('.daterangepicker.dropdown-menu,.colorpicker.dropdown-menu,.bootstrap-datetimepicker-widget.dropdown-menu').remove();
			});

		});
	</script>
</body>
</html>